<template>
  <el-dialog v-model="dialogFormVisible" :title="title" @close="closeDialog" style="width: 600px;">
    <el-form :model="batchVoidForm" ref="addAppRef" :rules="batchVoidrules">
      <el-form-item label="审批时间" :label-width="formLabelWidth" prop="approvalTimeStr">
        <el-config-provider :locale="locale">
          <el-date-picker v-model="batchVoidForm.approvalTimeStr" @change="changeTime" type="datetime"
            @focus="focusTimeHandle" placeholder="请选择审核时间" style="width: 100%;" />
        </el-config-provider>
      </el-form-item>
      <el-form-item label="学科组合" :label-width="formLabelWidth" prop="courseType">
        <el-select v-model="batchVoidForm.courseType" autocomplete="off" clearable placeholder="请选择选科"
          @change="selectChange">
          <el-option key="1" value="物化生" label="物化生"></el-option>
          <el-option key="2" value="物化地" label="物化地"></el-option>
          <el-option key="3" value="物化政" label="物化政"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="总分" :label-width="formLabelWidth" prop="total">
        <el-input placeholder="请输入总分" v-model="batchVoidForm.total" @input="totalInput"></el-input>
      </el-form-item>



    </el-form>
    <template #footer>
      <span class="dialog-footer">
        <el-button @click="cancel()">取消</el-button>
        <el-button type="primary" @click="save()">保存</el-button>
      </span>
    </template>
  </el-dialog>
</template>

<script>
import { ref } from "vue";
import { httpService } from "@/utils/httpService";
import { ElConfigProvider, ElMessage, ElForm, ElMessageBox } from "element-plus";
import zhCn from "element-plus/lib/locale/lang/zh-cn";
import { vxRule } from "@/utils/validator";
import { formatTime1 } from "@/utils/dateFormat";
export default {
  name: "AddApp",
  components: { ElForm, ElMessage, ElConfigProvider, ElMessageBox },
  setup() {
    return {
      locale: zhCn,
    };
  },
  data() {
    return {
      dialogFormVisible: ref(false),
      formLabelWidth: "120px",
      title: "",
      personnelType: "",
      baseRoleList: [],
      batchVoidForm: {
        approvalTimeStr: "",
        courseType: "",
        total: "",
      },
      // 校验规则
      batchVoidrules: {
        approvalTimeStr: vxRule(true, null, "blur"),
      },
    };
  },
  methods: {
    closeDialog() {
      this.clear();
    },
    cancel() {
      this.dialogFormVisible = false;
      this.clear();
    },
    focusTimeHandle() {
      let currentDate = new Date();
      currentDate.setDate(currentDate.getDate() - 7);
      this.batchVoidForm.approvalTimeStr = formatTime1(currentDate)
    },
    changeTime(value) {
      this.batchVoidForm.approvalTimeStr = formatTime1(value)
    },
    clear() {
      this.dialogFormVisible = false;
      this.batchVoidForm.approvalTimeStr = ""
      this.batchVoidForm.courseType = ""
      this.batchVoidForm.total = ""
    },
    save() {
      if (!this.batchVoidForm.approvalTimeStr) {
        return ElMessage.warning("请选择审批时间");
      }
      let str = `确定要作废审批时间在${this.batchVoidForm.approvalTimeStr}之前`
      if (this.batchVoidForm.total) {
        str = str + `,总分低于${this.batchVoidForm.total}(不含${this.batchVoidForm.total})`
      }
      if (this.batchVoidForm.courseType) {
        str = str + `,选课类型为${this.batchVoidForm.courseType}`
      }
      str = str + "的学生吗？"
      ElMessageBox.confirm(str, "提醒", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          this.batchVoidForm.courseType ? this.batchVoidForm.courseType : this.batchVoidForm.courseType = ''

          let params = new FormData()
          params.append("courseType", this.batchVoidForm.courseType)
          params.append("total", this.batchVoidForm.total)
          params.append("approvalTimeStr", this.batchVoidForm.approvalTimeStr) 
          httpService("/javaApi/reviewStudentForm/repeal ", params, "post").then(
            (data) => {
              if (data.code == 200) {
                ElMessage.success("作废成功");
                this.clear()
                this.$parent.getReviewStudentList();
              } else {
                ElMessage.error("作废失败，请重试！");
              }
            }
          );
        })
        .catch(() => {
        });
    }
  },
};
</script>
<style>
.el-my-select {
  display: inline-block;
  position: relative;
  line-height: 32px;
  width: 100%;
}

.el-dialog__header {
  padding: var(--el-dialog-padding-primary);
  padding-bottom: 10px;
  border-bottom: 1px solid #dedede;
  margin-bottom: 10px;
}
</style>